<template>
	<view>
		<view class="writebox">
			<view class="titlebox">
				选择取货方式
				<image @click="close()" src="../static/gb.png"></image>
			</view>
			<view class="way">
				<view :style="{'color':currindex==index?'#F94D29':''}" class="selectbox" @click="change(index)"
				 v-for="(item,index) in list" :key="index">
					<view style="line-height: 45rpx;">{{item}}</view>
					<view :style="{'background':currindex==index?'#F94D29':'#FFF'}" class="titbox"></view>
				</view>
			</view>
			<!-- 自提 -->
			<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper" v-if="currindex==0"
				@scrolltolower="lower" @scroll="scroll">
				<view class="listbox" @click="deliverymethod()">
					<view class="imgbox">
						<image  src="../static/gou.png"></image>
						<!-- <image v-else src="../static/image/dz.png"></image> -->
					</view>
					<view class="illustrate">
						<!-- <view>滨江一号    13876263500</view> -->
						<view class="tipbox">{{seftpick}}</view>
					</view>
				</view>
			</scroll-view>
			<view class="navbut" @click="deliverymethod()" v-if="currindex==0">
				确定
			</view>
			<!-- 配送 -->
			<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper" v-if="currindex==1"
				@scrolltolower="lower" @scroll="scroll">
				<view class="listbox" v-for="(item,index) in addresslist" :key="index" @click="handleaddress(index)">
					<view class="imgbox">
						<image v-if="dzindex==index" src="../static/gou.png"></image>
						<image v-else src="../static/yuan.png"></image>
					</view>
					<view class="illustrate">
						<view>{{item.shouhuoren}}{{item.mobile}}</view>
						<view class="tipbox">{{item.province}}{{item.city}}{{item.town}}{{item.street}}</view>
					</view>
				</view>
			</scroll-view>
			<view class="navbut" v-if="currindex==1" @click="toaddress()">
				<image src="../static/add1.png"></image>
				新建地址
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"selfpick",
		props:{
			addresslist:{
				type:Array,
				default:[]
			},
			currone:{
				type:Number,
				default:0
			},
			seftpick:{
				type:String,
				default:''
			},
			is_takeaway:{
				type:Number,
				default:1
			}
		},
		data() {
			return {
				list:['自提','配送'],
				currindex:this.currone,
				dzindex:'',//地址
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
			};
		},
		created(){
			//is_takeaway 是否外卖商家 0否 1是
			if(this.is_takeaway==0){
				this.list = this.list.slice(0,1)
			}
			// this.dzindex = this.addresslist.findIndex(item => item.isdefault==1)
			// if(this.dzindex){
			// 	this.emit('addressid',this.addresslist[this.dzindex].id)
			// }
		},
		methods:{
			upper: function(e) {
				// console.log(e)
			},
			lower: function(e) {
				// console.log(e)
			},
			scroll: function(e) {
				// console.log(e)
				this.old.scrollTop = e.detail.scrollTop
			},
			close(){
				this.$emit('close')
			},
			//选择物流配送地址
			handleaddress(index){
				this.dzindex = index
				this.$emit('addressid',this.addresslist[index].id)
			},
			change(index){
				this.currindex = index //delivery_method
			},
			toaddress(){
				uni.navigateTo({
					url:'/personalData/address/address'
				})
			},
			//门店自提
			deliverymethod(){
				this.$emit('deliverymethod',this.seftpick)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.writebox{
		background-color: #FFF;
		width: 100%;
		border-radius: 20rpx 20rpx 0 0;
		padding-bottom: 20rpx;
		.titlebox{
			display: flex;
			justify-content: center;
			position: relative;
			height: 112rpx;
			align-items: center;
			image{
				width: 40rpx;
				height: 40rpx;
				border-radius: 100%;
				position: absolute;
				right: 30rpx;
			}
		}
		.way{
			height: 108rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			.selectbox{
				font-size: 28rpx;
				font-family: Source Han Sans CN-Regular, Source Han Sans CN;
				font-weight: 400;
				color: #222222;
				text-align: center;
				width: 50%;
				.titbox{
					width: 89rpx;
					margin: 0 auto;
					height: 5rpx;
					// background: linear-gradient(180deg, #CB9852 0%, #F8DEB7 100%);
					border-radius: 3rpx ;
				}
			}
		}
		.scroll-Y {
			height: 600rpx;
			// .scroll-view-item {
			// 	height: 300rpx;
			// 	line-height: 300rpx;
			// 	text-align: center;
			// 	font-size: 36rpx;
			// }
			.listbox{
				display: flex;
				align-items: center;
				height: 170rpx;
				.imgbox{
					width: 88rpx;
					text-align: center;
					image{
						width: 36rpx;
						height: 36rpx;
					}
				}
				.illustrate{
					font-size: 32rpx;
					font-family: SourceHanSansCN-Medium-, SourceHanSansCN-Medium;
					font-weight: normal;
					color: #222222;
					line-height: 55rpx;
					.tipbox{
						font-size: 28rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;
						color: #888888;
					}
				}
			}
		}
		.navbut{
			width: 690rpx;
			height: 84rpx;
			background: linear-gradient(360deg, #F99529 0%, #F94D29 100%);
			border-radius: 83rpx ;
			margin: 0 auto;
			line-height: 84rpx;
			font-size: 32rpx;
			font-family: Source Han Sans CN-Medium, Source Han Sans CN;
			font-weight: 500;
			color: #FFFFFF;
			display: flex;
			justify-content: center;
			align-items: center;
			image{
				width: 28rpx;
				height: 28rpx;
				margin-right: 20rpx;
			}
		}
	}
	
	

</style>